Related GitHub Issue

Closes: #8278

Description

This PR fixes the filename truncation issue in file editing/reading notices by adding tooltips that display the full file path on hover.

Implementation details:

• Added StandardTooltip components wrapping file path displays in three locations:
  • CodeAccordian.tsx - General file path headers and custom headers
  • ChatRow.tsx - Single file read/edit operations
  • BatchFilePermission.tsx - Batch file permission requests
• Configured tooltips with className="text-wrap max-w-[min(300px,100vw)]" to:
  • Override the default text-balance CSS (which was causing excessive whitespace)
  • Use responsive max-width that adapts to panel size (300px max on wide panels, 100vw on narrow)
  • Leverage existing break-words CSS for natural line breaking at path separators

Key design choices:

• Chose to use text-wrap instead of text-balance to minimize whitespace while maintaining readability
• Used max-w-[min(300px,100vw)] instead of a fixed width to prevent tooltip cutoff in narrow panels while maintaining a reasonable max width

Reviewers should note:

• The tooltip styling is consistent with other tooltips in the extension (using the existing TooltipProvider and StandardTooltip components)

Test Procedure

Manual testing steps:

1. Test truncated paths show tooltips:

   • Open Roo Code and start a chat session
   • Ask Roo to read or edit a file with a long path (e.g., src/components/chat/file/with/deeply/nested/structure.tsx)
   • Narrow the chat panel until the filename truncates (shows ellipsis)
   • Hover over the truncated filename in the notice
   • ✅ Verify: Tooltip appears showing the full file path
   • ✅ Verify: Tooltip wraps text to multiple lines without being cut off

2. Test all tooltip locations:

   • Test tooltips on:
     • Single file read operations
     • Single file edit operations
     • Batch file read operations
     • Batch file edit operations
     • Directory listing operations (listFilesTopLevel, listFilesRecursive tools)
     • Search operations (searchFiles, listCodeDefinitionNames tools)
     • ✅ Verify: All locations show tooltips with consistent behavior

Testing environment:

• Tested on narrow panel widths (200px - 400px)
• Tested on standard panel widths (400px - 800px)
• Tested with various file path lengths

Pre-Submission Checklist

• Issue Linked: This PR is linked to an approved GitHub Issue (see "Related GitHub Issue" above).
• Scope: My changes are focused on the linked issue (one major feature/fix per PR).
• Self-Review: I have performed a thorough self-review of my code.
• Testing: New and/or updated tests have been added to cover my changes (if applicable).
• Documentation Impact: I have considered if my changes require documentation updates (see "Documentation Updates" section below).
• Contribution Guidelines: I have read and agree to the Contributor Guidelines.

Screenshots / Videos

Before: Filename truncated, no tooltip on hover.

After: Tooltip on hover.

Documentation Updates

• No documentation updates are required.

Get in Touch

Discord: @ocean.smith